<template>
	<UnobstructedPopup v-if="value">
		<template v-slot:body>
			<view style="height: 100%;overflow: hidden;display: flex;flex-direction: column;">
				<u-tabs name="evidenceName" count="evidenceCount" :list="evidenceChainList" :current="evidenceChainCurrent" @change="evidenceChainChange"></u-tabs>
				<view style="flex:1;overflow: hidden;">
					<view v-if="moduleList.length" style="height: 100%;display: flex;flex-direction: column;">
						<u-tabs name="title" :list="moduleList" :current="moduleCurrnet" @change="moduleChange"></u-tabs>
						<scroll-view style="height: calc(100% - 44px);" scroll-y>
							<component :is="componentId" :formData="formData" :dictId="currentDictId"></component>
						</scroll-view>
					</view>
					<view v-else class="empty">
						<u-empty text="暂无数据" mode="list" icon-size="300" font-size="60"></u-empty>
					</view>
				</view>
			</view>
		</template>
	</UnobstructedPopup>
</template>

<script>
	import {
		getLocalArchivesDetail,
		getLocalNoticeList
	} from '@/static/common/js/padLocalFileHandler.js'
	import {
		moduleMap,
		MODULE_DICTID
	} from '@/const/modules/index.js'

	import UnobstructedPopup from '@/components/unobstructed-popup/unobstructed-popup.vue'
	import RecordCom from './record.vue'
	import InventoryCom from './inventory.vue'
	import LossCom from './loss.vue'
	import NoticeCom from './notice.vue'

	import PenrecordTem from '@/pagesH5/components/inquiryTemplate/penrecordTem.vue'
	import InventoryTem from '@/pagesH5/components/inquiryTemplate/inventoryTem.vue'
	import LossTem from '@/pagesH5/components/inquiryTemplate/lossTem.vue'

	export default {
		components: {
			UnobstructedPopup,
			RecordCom,
			InventoryCom,
			LossCom,
			NoticeCom,
			PenrecordTem,
			InventoryTem,
			LossTem
		},
		props: {
			value: {
				type: Boolean,
				default: false
			},
			params: {
				type: Object,
				default: () => ({})
			}
		},
		data() {
			return {
				evidenceChainCurrent: 0,
				evidenceChainList: [],
				moduleCurrnet: 0,
				moduleList: [],
				formData: {}
			}
		},
		computed: {

			componentId() {
				const active = this.evidenceChainList[this.evidenceChainCurrent].dictId
				const obj = {
					[MODULE_DICTID.note]: 'PenrecordTem',
					[MODULE_DICTID.extract]: 'InventoryTem',
					[MODULE_DICTID.loss]: 'LossTem'
				}
				return obj[active] || 'NoticeCom'
			},
			currentDictId() {
				return this.evidenceChainList[this.evidenceChainCurrent].dictId
			}
		},
		async created() {
			// #ifdef APP-PLUS
			console.log(this.params);
			const {
				archivesId
			} = this.params
			const archivesData = await getLocalArchivesDetail(archivesId)
			const result = await getLocalNoticeList(archivesId, archivesData.archivesType)
			const {
				inquest,
				accident
			} = MODULE_DICTID
			const list = result.filter(item => {
				return ![inquest, accident].includes(parseInt(item.dictId))
			}).map(item => {
				return {
					...item,
					evidenceName: moduleMap[item.dictId],
					evidenceCount: item.mapList.length,
				}
			})
			this.evidenceChainList = list
			this.moduleList = list[0].mapList
			this.formData = this.moduleList[0]
			// #endif
		},
		methods: {
			evidenceChainChange(index) {
				this.moduleCurrnet = 0
				this.evidenceChainCurrent = index;
				this.moduleList = this.evidenceChainList[index].mapList
				this.formData = this.moduleList[this.moduleCurrnet]
			},
			moduleChange(index) {
				this.moduleCurrnet = index
				this.formData = this.moduleList[index]
			}
		}
	}
</script>
<style scoped></style>